<template>
	<view class="my-exam">
		<view class="block" v-for="item in dataObj.list" :key="item.examId" @click="onPageTap(item)">
			<view class="content">
				<image class="cover" src="../../../static/images/user/cover-exam.png"></image>
				<view class="title">{{item.examName}}</view>
				<view class="time">用时：{{item.sumExamMinute}}</view>
			</view>
			<view class="grade">
				<span>我的成绩</span>
				<span class="number">{{item.totalScore || 0}}分</span>
			</view>
		</view>
	</view>
</template>

<script>
	import { requestErrorTip, loginExam } from '@/common/tools.js';
	
	export default {
		data() {
			return {
				dataObj: {
					sum: 20,
					list: [],
				}
			}
		},
		onLoad(event) {
			const title = event['title']; // 获取试题名称
			this.dataObj['title'] = title;
			this.dataObj['id'] = event['id']; // 获取试题id
			uni.setNavigationBarTitle({
			　　title: title
			});
			this.getExamInfo();
		},
		// 下拉刷新
		onPullDownRefresh() {
			this.getExamInfo();
			setTimeout(function () {
				uni.stopPullDownRefresh();
			}, 1000);
		},
		methods: {
			// 页面跳转
			onPageTap(item) {
				uni.navigateTo({
					url: '/pages/question/result?examId=' + item.examId + '&title=' + item.examName
				});
			},
			// 获取考试信息
			getExamInfo() {
				this.$Requset({
					url: this.$Api['exam']['getExamInfo'],
					data: {
						token_exam: uni.getStorageSync('examToken'),
						studentId: uni.getStorageSync('studentId'),
						subjectId: this.dataObj['id'],
					},
					method: 'POST',
					success: (res) => {
						const { data, status, message } = res;
						if (status !== 300) {
							if (status === 103) {
								const userInfo = uni.getStorageSync('userInfo');
								const mobile = userInfo['mobile'];
								loginExam(mobile, () => {
									this.getExamInfo();
								});
								return;
							}
							requestErrorTip('toast', message);
							return;
						}
						this.dataObj['examName'] = data['examName'];
						this.getExamList();
					},
					fail: (err) => {
						console.log(err);
					}
				})
			},
			// 获取考试记录
			getExamList() {
				this.$Requset({
					url: this.$Api['exam']['getExamList'],
					data: {
						token_exam: uni.getStorageSync('examToken'),
						studentId: uni.getStorageSync('studentId'),
						subjectId: this.dataObj['id']
					},
					method: 'POST',
					success: (res) => {
						const { data, status, message } = res;
						if (status !== 300) {
							this.dataObj['list'] = [];
							if (status === 103) {
								const userInfo = uni.getStorageSync('userInfo');
								const mobile = userInfo['mobile'];
								loginExam(mobile, () => {
									this.getExamList(cb);
								});
								return;
							}
							requestErrorTip('toast', message);
							return;
						}
						this.dataObj['list'] = data;
						data.forEach((item) => {
							item.examName = this.dataObj['examName'];
							if(item['state'] === 1) {
								this.dataObj['examId'] = item['examId'];
							}
						})
					},
					fail: (err) => {
						console.log(err);
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	page{
		background-color: #f5f5f5;
	}
	.my-exam{
		padding-top: 18rpx;
		.block{
			padding-right: 0;
			padding-bottom: 0;
			.content{
				position: relative;
				padding: 0 72rpx 32rpx 114rpx;
				&::after{
					content: '';
					position: absolute;
					top: 30rpx;
					right: 36rpx;
					width: 28rpx;
					height: 28rpx;
					background-repeat: no-repeat;
					background-position: center;
					background-size: 100%;
					background-image: url(../../../static/images/common/arrow-right.png);
				}
				.cover{
					position: absolute;
					top: 0;
					left: 0;
					width: 90rpx;
					height: 90rpx;
					background-color: #EEE;
					border-radius: 22rpx;
				}
				.title{
					line-height: 44rpx;
					font-size: 30rpx;
					color: #1A1A1A;
					margin-bottom: 16rpx;
				}
				.time{
					line-height: 30rpx;
					font-size: 22rpx;
					color: #7F7F7F;
				}
			}
			.grade{
				line-height: 72rpx;
				font-size: 24rpx;
				color: #373737;
				padding-right: 36rpx;
				border-top: 1rpx solid #EAEFF1;
				.number{
					float: right;
					color: #7F7F7F;
				}
			}
		}
	}
</style>
